<template>
  <view class="feedback">
    <nav-bar title="反馈报告"></nav-bar>
    <scroll-view scroll-y :style="{ height: scrollHeight }">
      <view class="content-box">
        <view class="form-box">
          <view class="top-title">
            <view class="title">请确认您的身体信息</view>
            <view class="desc">医师将根据反馈给出阶段性的评估报告和后续治疗建议</view>
          </view>
          <view class="time-box" v-if="feedbackData.createDate">
            反馈时间：{{ feedbackData.createDate }}
          </view>
          <you-form
            v-if="showForm"
            ref="form"
            :showFormTitle="false"
            :formConfig="feedbackConfig"
            v-model="feedbackData"
          ></you-form>
        </view>
      </view>
    </scroll-view>
    <you-bottom-btn
      v-if="showBottomBtn"
      :btnConfig="bottomBtnConfig"
      @clickConfirm="clickConfirm"
    ></you-bottom-btn>
  </view>
</template>

<script>
  import { FEEDBACK_FORM } from './formConfig/feedbackConfig'
  import api_user from '@/api/user'
  export default {
    name: 'TrainFeedback',
    data() {
      return {
        scrollHeight: '',
        planId: '',
        feedbackConfig: [],
        feedbackData: {},
        bottomBtnConfig: [
          { text: '确认提交', class: 'confirm', funcName: 'clickConfirm' }
        ],
        showBottomBtn: false,
        showForm: false
      }
    },
    onLoad(options) {
      this.scrollHeight = this.$store.getters.heightData.noTabMainHeight - 85 + 'px'
      this.feedbackConfig = uni.$u.deepClone(FEEDBACK_FORM)
      this.planId = options.planId
      if (options.justView) {
        this.feedbackConfig.forEach(item => {
          item.isDisabled = true
        })
        this.scrollHeight = this.$store.getters.heightData.noTabMainHeight - 10 + 'px'
        this.getFeedbackDetail()
      } else {
        this.showBottomBtn = true
        this.showForm = true
      }
    },
    methods: {
      getFeedbackDetail() {
        const params = {
          planId: this.planId
        }
        api_user.getFeedbackDetail(params).then(res => {
          if (res.code !== 200) return
          this.feedbackData = res.data
          this.showForm = true
        })
      },
      async clickConfirm() {
        const formCheck = await this.$refs.form.checkFormData()
        if (!formCheck) return uni.$u.toast('请将表单数据填写完整')
        if (!this.feedbackData.bodyFaceImg) return uni.$u.toast('请上传正面照')
        if (!this.feedbackData.bodyBackImg) return uni.$u.toast('请上传背面照')
        if (!this.feedbackData.bodySideImg) return uni.$u.toast('请上传侧面照')
        const params = { 
          ...this.feedbackData,
          planId: this.planId
        }
        api_user.addFeedback(params).then(res => {
          if (res.code !== 200) return
          uni.showToast({
            title: '反馈成功！',
            icon: 'success',
            mask: true
          })
          uni.switchTab({
            url: `/pages/userTrainPlan`
          })
        })
      }
    }
  }
</script>
<style lang="scss" scoped>
  .feedback {
    height: 100vh;
    background-color: #F0F3F5;
    .content-box {
      padding-top: 30rpx;
      .form-box {
        .top-title {
          padding: 30rpx;
          .title {
            margin-bottom: 8rpx;
            font-size: 36rpx;
            font-weight: 500;
            color: #333;
          }
          .desc {
            font-size: 24rpx;
            color: #999;
          }
        }
        .time-box {
          padding: 0 30rpx 30rpx;
        }
        margin: 0 30rpx;
        border-radius: 16rpx;
        background-color: #FFF;
        overflow: hidden;
      }
    }
  }
</style>
